import articleItemsLess from "./articleItems.module.less";
import Comment from "../comment/index";
import { LikeOutlined, MessageOutlined } from "@ant-design/icons";
function ArticleItems() {
  return (
    <>
      <div className={articleItemsLess.articleItemsContent}>
        <div className="top_tips">
          <div className="username">臣不知代码</div>
          <div className="tips">赞了这篇文章</div>
        </div>
        <div className="content">
          <div className="topPadding">
            <div className="top_author_info">
              <div className="left_author">
                <div className="left_header_img">
                  <img src="/public/img/20240201103842.png" alt="" />
                </div>
                <div className="right_info">
                  <div className="topName">书中枫叶</div>
                  <div className="userInfo">
                    <div className="userInfoPro">前端开发工程师</div>
                    <div className="point">·</div>
                    <div className="time">7个月前</div>
                  </div>
                </div>
              </div>
              <div className="right_guanzhu_btn">
                <div className="btn">关注</div>
              </div>
            </div>
            <div className="center_article">
              <div className="title">
                微信小程序支付功能前后端全流程实践 全新的微信支付 APIv3
                Nodejs实现
              </div>
              <div className="article_content">
                <div className="left_article">
                  自己实现一个带支付功能的小程序，前端使用uniapp，后端使用Node.js，将实现微信小程序支付功能的全流程详细记录下来。使用的是全新的微信支付
                  APIv3，优点是 -
                </div>
                <div className="right_img">
                  <img src="/public/img/20240201103842.png" alt="" />
                </div>
              </div>
            </div>
          </div>
          <div className="bottom_like_recommt_share">
            <div className="items">
              <div className="icon">
                <LikeOutlined />
              </div>
              <div className="value">463</div>
            </div>
            <div className="items">
              <div className="icon">
                <MessageOutlined />
              </div>
              <div className="value">463</div>
            </div>
            <div className="items">
              <div className="icon">
                <MessageOutlined />
              </div>
              <div className="value">分享</div>
            </div>
          </div>
        </div>
      </div>
    </>
  );
}

export default ArticleItems;
